<template>
  <div id="questionsView">
    <a-card title="用户提交信息">
      <a-space direction="vertical" fill>
        <a-descriptions title="执行信息">
          <a-descriptions-item label="题目名称">
            {{ submitData.question?.title }}
          </a-descriptions-item>
          <a-descriptions-item label="用户名称">
            {{ submitData.user?.nickname }}
          </a-descriptions-item>
          <a-descriptions-item>
          </a-descriptions-item>
          <a-descriptions-item label="执行时间">
            {{ submitData.judgeInfo?.time || '-' }} ms
          </a-descriptions-item>
          <a-descriptions-item label="消耗内存">
            {{ submitData.judgeInfo?.memory || '-' }} mb
          </a-descriptions-item>
          <a-descriptions-item label="返回信息">
            {{ submitData.judgeInfo?.message }}
          </a-descriptions-item>
        </a-descriptions>
        <a-descriptions title="用户源代码">
          <a-descriptions-item>
            {{ submitData.code }}
          </a-descriptions-item>
        </a-descriptions>
      </a-space>
    </a-card>
  </div>
</template>

<script setup lang="ts">
import { onMounted, ref, watchEffect } from "vue";
import {
  JudgeInfo,
  SubmitControllerService,
  SubmitVO
} from "../../../generated";
import message from "@arco-design/web-vue/es/message";
import { useStore } from "vuex";
import { useRouter } from "vue-router";

const router = useRouter();
const store = useStore();
const submitData = ref<SubmitVO>({
  code: "",
  judgeInfo: undefined,
  language: undefined,
  languageText: "",
  question: undefined,
  status: undefined,
  statusText: "",
  user: undefined,
})

interface Props {
  id: string;
}

const props = withDefaults(defineProps<Props>(), {
  id: "",
});


const loadData = async () => {
  const res = await SubmitControllerService.getSubmitVoByIdUsingPost(
    props.id as any
  );
  submitData.value = res.data
};


/**
 * 监听 searchParams 变量，改变时触发页面的重新加载
 */
watchEffect(() => {
  loadData();
});

/**
 * 页面加载时，请求数据
 */
onMounted(() => {
  loadData();
});

</script>

<style scoped>
#questionsView {
  max-width: 1280px;
  margin: 0 auto;
}
</style>
